<template>
    <div style="background-color: rgba(255, 255, 255, 0.2);  height: 40px;">
        <el-button type="danger" @click="uoquit" :icon="Back" circle style="margin-top: 5px; margin-left: 20px; " />
        <el-button style="margin-left: 30px; margin-top: 5px;" type="primary" :icon="RefreshRight" circle @click="openwind()"/>
        <el-button  @click="collesss" style="margin-left: 30px; margin-top: 5px;"
            type="success" :icon="DocumentCopy" circle />
    </div>
</template>

<script lang="ts" setup>
import { ref, watch } from 'vue';
import { Back, RefreshRight, Collection, DocumentCopy } from '@element-plus/icons-vue'
import { useRoute, useRouter } from 'vue-router';
// 获取当前路由对象
const route = useRoute();
const router = useRouter();
//路由
// const currentRouteTitle = ref("登录/注册");
const currentRouteTitle = ref(route.meta.title);
watch(
    () => route.path,
    () => {
        currentRouteTitle.value = route.meta.title || '';
    }
);
const openwind = () => {
    window.location.reload();
}
const uoquit = () => {
    let luyou = currentRouteTitle.value;
    router.push("/");
    switch (luyou) {
        case "弹奏页面":
            router.push("/home");
            return;
        case "404":
            router.push("/");
            return;
        case "登录/注册":
            router.push("/");
            return;
        case "主页":
            router.push("/home");
            return;
        default:
            router.push("/home");
            return;
    }
}
const collesss = () => {
    router.push("/home");
}
</script>

<style scoped>
.window-drag-area {
    -webkit-app-region: drag;

    /* 允许拖动 */
    button {
        -webkit-app-region: no-drag;
        /* 禁止拖动 */
    }
}
</style>